<template>
	<view class="container">
		<u-navbar title="简历优化" @leftClick="toBack" placeholder></u-navbar>
		<view class="bigNav">
			<view class="topnav">
				<view class="leftnav">
					<text>您的简历可优化{{data.defectResumeNum}}项</text>
					<text>您的简历完整度较差，严重影响求职质量，建议立即完善</text>
				</view>
				<view class="bottomnav">
					<view class="tistop">
						<view class="tiscenter">
							<image src="/pages/pagesPersonal/static/personal/tis.png"></image>
							<text>完整的简历，更容易获得招聘方的关注</text>
						</view>
					</view>
					<view class="listbox">
						<view class="optimizeList" v-for="(item,index) in data.defectResumeAry" :key="index">
							<view class="leftoptim">
								<text>补充{{item.remarks}}</text>
								<text style="padding-right: 20rpx;">{{ data.defectResumeTextObj[item.field] }}</text>
							</view>
							<view class="rightoptim"><button @tap="handleDefectResumeJump(item)">去补充</button></view>
						</view>
					</view>
				</view>
				<view class="tis" @tap="$u.throttle(tohome,2000)"><text>稍后再完善，点击进入会员中心</text></view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from "vue"
	import {
		onReady,
		onShow,
		onLoad
	} from '@dcloudio/uni-app'
	const data = reactive({
		isNav: true,
		defectResumeAry: [],
		defectResumeTextObj: {
			specialty: '您还没有添加自我描述，简单介绍下自己，向HR展示下您的优势。',
			education: '建议补充教育经历，详细的教育经历可以加大你面试的成功率',
			work: '建议补充工作经历，让HR看到你过往的工作能力',
			training: '建议补充培训经历，更好的展示你的学习能力和职业技能水平',
			project: '建议补充项目经历，向HR展示你对岗位的操作技能和胜任力',
			certificate: '建议补充证书获得情况，突出您的个人能力，以此来获得较高的入职希望',
			tag: '建议补充特长标签，更能体现出您的个人能力、特长、兴趣 ...',
			img: '建议补充自己的作品，让HR直观了解您的能力，增加面试邀请的机率'
		},
		defectResumeNum: 0
	})
	// 返回上一页
	const toBack = () => {
		if (!data.isNav) {
			uni.$u.route({
				type: 'redirect',
				url: 'pages/login/status'
			})
		} else {
			uni.$u.route({
				type: 'back'
			})
		}
	}
	//获取简历待优化项
	const isComplete = async () => {
		let res = await uni.$u.api.isComplete()
		if (res) {
			data.defectResumeAry = res.no_complete_array
			data.defectResumeNum = res.no_complete_count
			if (data.defectResumeNum == 0) { //如果全部项处理跳转到我的简历页面
				uni.$u.route({
					type: 'back'
				})
			}
		}
	}
	//跳转到我的页面
	const tohome = () => {
		uni.switchTab({
			url: '/pages/personal/index'
		});

	}
	// 优化简历跳转
	const handleDefectResumeJump = (item) => {
		let routerObj = {
			basic: 'pages/pagesPersonal/myResume/information/information',
			intention: 'pages/pagesHome/jobIntention/detail?type=add',
			specialty: 'pages/pagesPersonal/myResume/information/child/child?type=1',
			education: 'pages/pagesPersonal/myResume/education/education?type=add',
			work: 'pages/pagesPersonal/myResume/experience/experience?type=add',
			training: 'pages/pagesPersonal/myResume/train/train?type=add',
			project: 'pages/pagesPersonal/myResume/Project/Project?type=add',
			certificate: 'pages/pagesPersonal/myResume/certificate/certificate?type=add',
			tag: 'pages/pagesPersonal/myResume/strong/strong',
			img: 'pages/pagesPersonal/myResume/myResume'
		}
		uni.$u.route(routerObj[item.field])
	}
	onShow(() => {
		isComplete()
	})
</script>

<style lang="scss">
	page,
	body {
		// width: 100vw;
		// height: 100%;
		background: #007dfe;
	}

	.container {
		padding: 30rpx;
		width: 100vw;
		height: 100%;

		.bigNav {
			.topnav {
				width: 100%;
				height: 300rpx;
				background-image: url("/pages/pagesPersonal/static/personal/static_personal_bg.png");
				background-repeat: no-repeat;
				background-position: right;
				background-size: 246rpx 278rpx;

				.leftnav {
					width: 450rpx;
					height: 100%;
					display: flex;
					flex-direction: column;
					justify-content: center;
					color: #fff;
					font-size: 26rpx;
					font-family: SourceHanSansSC-light;

					text:nth-child(1) {
						font-size: 48rpx;
						font-weight: bold;
						margin: 20rpx 0;
						font-family: SourceHanSansSC-medium;
						;
					}
				}
			}

			.bottomnav {
				width: 100%;
				min-height: 650rpx;
				background-image: linear-gradient(to bottom, #d6eaff, #e5f2ff, #ffffff);
				border-radius: 30rpx;
				overflow: hidden;

				.tistop {
					width: 100%;
					height: 150rpx;
					padding: 30rpx;

					.tiscenter {
						width: 100%;
						height: 100%;
						border-radius: 75rpx;
						background-color: #fff;
						display: flex;
						align-items: center;
						color: #F77702;
						font-size: 24rpx;
						padding-left: 10rpx;

						image {
							width: 66rpx;
							height: 66rpx;
							margin: 0 20rpx;
						}

					}
				}

				.listbox {
					width: 100%;

					.optimizeList {
						width: 100%;
						height: 240rpx;
						border-bottom: 1rpx solid #BBBBBB;
						display: flex;
						padding: 0 30rpx;

						.leftoptim {
							width: calc(100% - 162rpx);
							height: 100%;
							display: flex;
							flex-direction: column;
							justify-content: center;
							
							font-size: 24rpx;
							color: #797676;
							font-family: SourceHanSansSC-regular;

							text:nth-child(1) {
								font-size: 32rpx;
								font-weight: bold;
								color: #000;
								margin-bottom: 25rpx;
							}
						}

						.rightoptim {
							width: 162rpx;
							height: 100%;
							display: flex;
							justify-content: center;
							align-items: center;

							button {
								width: 162rpx;
								height: 68rpx;
								border-radius: 12rpx;
								color: #fff;
								background-color: #007dfe;
								font-size: 28rpx;
								font-family: SourceHanSansSC-regular;
							}
						}
					}
				}

			}

			.tis {
				text-align: center;
				font-size: 28rpx;
				color: rgba(255, 255, 255, 0.62);
				margin: 20rpx 0;
				height: 120rpx;
				line-height: 120rpx;
			}
		}
	}
</style>